DiyType3.vue

<template>
    <div>
        <v-card outlined class="rounded-lg">
            <v-card-text>

                <v-container>
                    <v-carousel
                        :continuous="true"
                        :show-arrows="false"
                        cycle
                        hide-delimiters
                        height="150"
                        class="rounded-lg elevation-2"
                    >
                        <v-carousel-item
                            v-for="(item, i) in data.targetItem"
                            :key="i"
                            :src="item.url"
                            :target="item.target"
                            :href="item.herf ? item.herf : ''"
                            :transition="false"
                        ></v-carousel-item>
                    </v-carousel>
                </v-container>

            </v-card-text>
        </v-card>

        <v-btn icon @click="handleClick" style="left: 50px">
            <v-icon>mdi-delete</v-icon>&nbsp;&nbsp;删除组件
        </v-btn>
    </div>
</template>

<script>
export default {
    props: {
        data: {
            type: Object,
        },
        id: {
            type: Number,
        }
    },
    methods: {
        handleClick() {
            this.$emit('del');
        },
    },
};
</script>
